<template>
  <div>
    <a-modal :title="title" :visible="showModal" @before-open="open" @cancel="handleCancel" :align-center="false" title-align="start" width="900px" :mask-closable="false">
      <a-form auto-label-width ref="formRef" size="medium" :model="form">
        <a-space direction="vertical" :size="24">
          <div style="display: flex" v-show="type != 'add'">
            <a-form-item field="transType" label="调拨单号">
              <span v-if="form.status == 1">{{ form.billNo }}</span>
              <span class="tag ml10" v-if="form.status == 1">草稿</span>
              <span class="tag ml10" v-if="form.status == 10">待审核</span>
              <span class="tag ml10" v-if="form.status == 20">驳回</span>
              <span class="tag ml10" v-if="form.status == 30">待出库</span>
              <span class="tag ml10" v-if="form.status == 40">待入库</span>
              <span class="tag ml10" v-if="form.status == 50">已完成</span>
            </a-form-item>
            <a-form-item field="transType" label="创建人">
              {{ form.createUname ? form.createUname : '--' }}
            </a-form-item>
            <a-form-item field="transType" label="创建时间">
              {{ $setTime(form.gmtCreate) }}
            </a-form-item>
          </div>
          <a-row>
            <a-col :span="8">
              <a-form-item field="transType" label="调拨类型" :rules="rules.transType">
                <a-select @change="changeWarehouseType" placeholder="请选择" v-model="form.transType">
                  <a-option label="国内仓-国内仓" :value="1" />
                  <a-option label="国内仓-海外仓" :value="2" />
                  <a-option label="海外仓-国内仓" :value="3" />
                  <a-option label="海外仓-海外仓" :value="4" />
                </a-select>
              </a-form-item>
            </a-col>
            <!-- <a-col :span="8">
              <a-form-item field="outWarehouseCode" label="调出仓" :rules="rules.outWarehouseCode">
                <a-select @change="tableList = []" placeholder="请选择" v-model="form.outWarehouseCode" allow-search>
                  <a-option v-for="item of outHouseList" :label="item.warehouseName" :value="item.warehouseCode"></a-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :span="8">
              <a-form-item field="inWarehouseCode" label="调入仓" :rules="rules.inWarehouseCode">
                <a-select placeholder="请选择" v-model="form.inWarehouseCode" allow-search>
                  <a-option v-for="item of inHouseList" :label="item.warehouseName" :value="item.warehouseCode"></a-option>
                </a-select>
              </a-form-item>
            </a-col> -->

            <!-- <a-col :span="8">
              <a-form-item field="shopId" label="店铺" :rules="rules.shopId">
                <a-select @change="selShop" placeholder="请选择" v-model="form.shopId" allow-search>
                  <a-option v-for="item of shopList" :label="item.shopName" :value="item.sellerMarketId"></a-option>
                </a-select>
              </a-form-item>
            </a-col> -->
            <a-col :span="8">
              <a-form-item field="logisticType" label="物流方式" :rules="rules.logisticType">
                <a-select placeholder="请选择" v-model="form.logisticType" allow-clear>
                  <a-option label="线下配送" :value="1" />
                  <a-option label="快递" :value="2" />
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :span="8">
              <a-form-item label="运费">
                <span>CNY</span>
                <a-input-number v-model="form.logisticFees" min="0" style="margin-left: 10px" />
              </a-form-item>
            </a-col>
          </a-row>
          <a-row>
            <a-col :span="8">
              <a-form-item label="物流跟踪号">
                <a-space>
                  <a-input v-model="form.logisticName" placeholder="物流商" />
                  <a-input v-model="form.logisticsTrackNumber" placeholder="跟踪号" />
                </a-space>
              </a-form-item>
            </a-col>
            <a-col :span="8">
              <a-form-item field="logisticType" label="分摊方式">
                <a-select placeholder="请选择" v-model="form.feesShareType" allow-clear>
                  <a-option label="不分摊" :value="0" />
                  <a-option label="按数量" :value="1" />
                  <a-option label="按金额" :value="2" />
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :span="8">
              <a-form-item label="其他费用">
                <span>CNY</span>
                <a-input-number v-model="form.otherFees" min="0" style="margin-left: 10px" />
              </a-form-item>
            </a-col>
          </a-row>
          <a-row>
            <a-col :span="8">
              <a-form-item label="附件">
                <a-upload v-if="showModal" v-model:file-list="fileList" action="#" :auto-upload="false" @before-remove="beforeRemove" @before-upload="beforeUpload">
                  <template #upload-button>
                    <span style="color: #5262ff">上传附件</span>
                  </template>
                </a-upload>
              </a-form-item>
            </a-col>
            <a-col :span="16">
              <a-form-item label="备注">
                <a-input v-model="form.remark" />
              </a-form-item>
            </a-col>
          </a-row>

          <a-row>
            <a-col :span="12">
              <div class="house-con">
                <div class="title-bar">调出</div>
                <a-form-item field="outWarehouseCode" label="调出仓" :rules="rules.outWarehouseCode">
                  <a-select @change="tableList = []" placeholder="请选择" v-model="form.outWarehouseCode" allow-search>
                    <a-option v-for="item of outHouseList" :label="item.warehouseName" :value="item.warehouseCode" />
                  </a-select>
                </a-form-item>
                <a-form-item field="shopId" label="店铺">
                  <a-select @change="selShop" placeholder="请选择" v-model="form.shopId" allow-search>
                    <a-option v-for="item of shopList" :label="item.shopName" :value="item.sellerMarketId" />
                  </a-select>
                </a-form-item>
                <a-form-item label="货主">
                  <a-select placeholder="请选择" allow-clear @change="ownerChange" v-model="form.ownerId" allow-search>
                    <a-option v-for="item of userList" :label="item.userName" :value="item.id" />
                  </a-select>
                </a-form-item>
              </div>
            </a-col>
            <a-col :span="12">
              <div class="house-con ml10">
                <div class="title-bar">调入</div>

                <a-form-item field="inWarehouseCode" label="调入仓" :rules="rules.inWarehouseCode">
                  <a-select placeholder="请选择" v-model="form.inWarehouseCode" allow-search>
                    <a-option v-for="item of inHouseList" :label="item.warehouseName" :value="item.warehouseCode" />
                  </a-select>
                </a-form-item>
                <a-form-item field="inShopId" label="店铺" :rules="rules.inShopId">
                  <a-select @change="selInShop" placeholder="请选择" v-model="form.inShopId" allow-search>
                    <a-option v-for="item of shopList" :label="item.shopName" :value="item.sellerMarketId" />
                  </a-select>
                </a-form-item>
                <a-form-item label="货主">
                  <a-select placeholder="请选择" allow-clear @change="inOwnerChange" v-model="form.inOwnerId" allow-search>
                    <a-option v-for="item of userList" :label="item.userName" :value="item.id" />
                  </a-select>
                </a-form-item>
              </div>
            </a-col>
          </a-row>
        </a-space>
      </a-form>
      <div class="top mt10" v-if="type == 'add'">
        <a-button size="medium" class="gray-outline" @click="add">添加产品</a-button>
        <span style="margin-left: 10px; display: inline-block"
          ><span>SKU种类：</span><span>{{ skuKind }}</span></span
        >
        <span style="margin-left: 10px; display: inline-block"
          ><span>调拨数量：</span><span>{{ provocateurNum }}</span></span
        >
        <span style="margin-left: 10px; display: inline-block"
          ><span>总货值：</span><span>￥{{ allPrice }}</span></span
        >
      </div>
      <a-table size="mini" v-if="type == 'add'" style="margin-top: 10px" class="table-singe-line" :data="tableList" :scroll="{ x: '100%', y: '280px' }" :pagination="false">
        <template #columns>
          <a-table-column title="店铺" :width="100">
            <template #cell="{ record }">
              <!-- <a-popover>
                <p style="width: 100%" class="text-limit">{{ record.shopName }}</p>
                <template #content>
                  <p>{{ record.shopName }}</p>
                </template>
              </a-popover> -->
              <TextLimit position="top" :rows="1">{{ record.shopName }}</TextLimit>
            </template>
          </a-table-column>
          <a-table-column title="货主" :width="90" #cell="{ record, rowIndex }"> {{ record.ownerName }} </a-table-column>
          <a-table-column title="图片" :width="60">
            <template #cell="{ record }">
              <ImgPopover :src="record.productImg">
                <template #con>
                  <a-image width="40" height="40" fit="contain" :src="record.productImg" />
                </template>
              </ImgPopover>
            </template>
          </a-table-column>
          <a-table-column title="产品名称/SKU" :width="100">
            <template #cell="{ record, rowIndex }">
              <a-popover>
                <p style="color: #619bd8; width: 100%" class="text-limit">{{ record.productName }}</p>
                <p style="color: #619bd8; width: 100%" class="text-limit">
                  <span>{{ record.sku }}</span>
                </p>
                <template #content>
                  <p>{{ record.productName }}</p>
                  <p>{{ record.sku }}</p>
                </template>
              </a-popover>
            </template>
          </a-table-column>
          <a-table-column title="MSKU/FNSKU" :width="100">
            <template #cell="{ record, rowIndex }">
              <a-popover>
                <p style="width: 100%" class="text-limit">
                  {{ record.msku }}
                </p>
                <p style="width: 100%" class="text-limit">
                  {{ record.fnsku }}
                </p>
                <template #content>
                  <p>{{ record.msku }}</p>
                  <p>{{ record.fnsku }}</p>
                </template>
              </a-popover>
            </template>
          </a-table-column>
          <a-table-column title="库存属性" :width="80">
            <template #cell="{ record, rowIndex }">{{ record.attribute == 'good' ? '良品' : '次品' }} </template>
          </a-table-column>
          <a-table-column title="可调数量" :width="80">
            <template #cell="{ record, rowIndex }">{{ record.amtAvailable }} </template>
          </a-table-column>

          <a-table-column title="调拨数量" :width="80">
            <template #cell="{ record }">
              <a-input-number :max="record.amtAvailable" min="0" hide-button v-model="record.amt" />
            </template>
          </a-table-column>
          <a-table-column title="单位成本" :width="80">
            <template #cell="{ record }">
              {{ record.avgPrice }}
            </template>
          </a-table-column>
          <a-table-column title="货值" :width="100">
            <template #cell="{ record }">
              {{ (record.amt || 0) * record.avgPrice }}
            </template>
          </a-table-column>
          <a-table-column title="操作" :width="60" fixed="right">
            <template #cell="{ record, rowIndex }">
              <a-button type="text" @click="tableList.splice(rowIndex, 1)">移除</a-button>
            </template>
          </a-table-column>
        </template>
      </a-table>

      <div v-if="type != 'add'">
        <a-tabs size="mini" v-model:active-key="activePage">
          <a-tab-pane key="1" title="调拨产品">
            <div class="top" style="margin-top: 10px">
              <a-button size="medium" class="gray-outline" @click="add">添加产品</a-button>
              <span style="margin-left: 10px; display: inline-block"
                ><span>SKU种类：</span><span>{{ skuKind }}</span></span
              >
              <span style="margin-left: 10px; display: inline-block"
                ><span>调拨数量：</span><span>{{ provocateurNum }}</span></span
              >
              <span style="margin-left: 10px; display: inline-block"
                ><span>总货值：</span><span>￥{{ allPrice }}</span></span
              >
            </div>
            <a-table size="mini" style="margin-top: 10px" class="table-singe-line" :data="tableList" :scroll="{ y: '280px' }" :pagination="false">
              <template #columns>
                <a-table-column title="店铺" :width="100">
                  <template #cell="{ record }">
                    <a-popover>
                      <p style="width: 100%" class="text-limit">{{ record.shopName }}</p>
                      <template #content>
                        <p>{{ record.shopName }}</p>
                      </template>
                    </a-popover>
                  </template>
                </a-table-column>
                <a-table-column title="货主" :width="90" #cell="{ record, rowIndex }"> {{ record.ownerName }} </a-table-column>
                <a-table-column title="图片" :width="60">
                  <template #cell="{ record }">
                    <ImgPopover :src="record.productImg">
                      <template #con>
                        <a-image width="40" height="40" fit="contain" :src="record.productImg" />
                      </template>
                    </ImgPopover>
                  </template>
                </a-table-column>
                <a-table-column title="产品名称/SKU" :width="100">
                  <template #cell="{ record, rowIndex }">
                    <a-popover>
                      <p style="color: #619bd8; width: 100%" class="text-limit">{{ record.productName }}</p>
                      <p style="color: #619bd8; width: 100%" class="text-limit">
                        <span>{{ record.sku }}</span>
                      </p>
                      <template #content>
                        <p>{{ record.productName }}</p>
                        <p>{{ record.sku }}</p>
                      </template>
                    </a-popover>
                  </template>
                </a-table-column>
                <a-table-column title="MSKU/FNSKU" :width="100">
                  <template #cell="{ record, rowIndex }">
                    <a-popover>
                      <p style="width: 100%" class="text-limit">
                        {{ record.msku }}
                      </p>
                      <p style="width: 100%" class="text-limit">
                        {{ record.fnsku }}
                      </p>
                      <template #content>
                        <p>{{ record.msku }}</p>
                        <p>{{ record.fnsku }}</p>
                      </template>
                    </a-popover>
                  </template>
                </a-table-column>
                <a-table-column title="库存属性" :width="80">
                  <template #cell="{ record, rowIndex }">{{ record.attribute == 'good' ? '良品' : '次品' }} </template>
                </a-table-column>
                <a-table-column title="可调数量" :width="80">
                  <template #cell="{ record, rowIndex }">{{ record.amtAvailable }} </template>
                </a-table-column>

                <a-table-column title="调拨数量" :width="80">
                  <template #cell="{ record }">
                    <a-input-number :max="record.amtAvailable" min="0" hide-button v-model="record.amt" />
                  </template>
                </a-table-column>
                <a-table-column title="单位成本" :width="80">
                  <template #cell="{ record }">
                    {{ record.avgPrice }}
                  </template>
                </a-table-column>
                <a-table-column title="货值" :width="120">
                  <template #cell="{ record }">
                    {{ (record.amt || 0) * record.avgPrice }}
                  </template>
                </a-table-column>
                <a-table-column title="操作" :width="60" fixed="right">
                  <template #cell="{ record, rowIndex }">
                    <a-button type="text" @click="tableList.splice(rowIndex, 1)">移除</a-button>
                  </template>
                </a-table-column>
              </template>
            </a-table>
          </a-tab-pane>
          <a-tab-pane key="2" title="单据日志">
            <div style="margin-top: 10px">
              <a-table size="mini" class="table-singe-line" :data="logList" :scroll="{ x: '100%', y: '280px' }" :pagination="false">
                <template #columns>
                  <a-table-column title="序号" :width="40">
                    <template #cell="{ record, rowIndex }">
                      {{ rowIndex + 1 }}
                    </template>
                  </a-table-column>
                  <a-table-column title="时间" :width="140">
                    <template #cell="{ record }">
                      {{ $setTime(record.gmtCreate) }}
                    </template>
                  </a-table-column>
                  <a-table-column title="操作人" :width="120">
                    <template #cell="{ record }">
                      {{ record.createUname }}
                    </template>
                  </a-table-column>
                  <a-table-column title="事件" :width="100">
                    <template #cell="{ record }">
                      <!-- {{ filterEventType(record.eventType) }} -->
                      {{ record.eventName }}
                    </template>
                  </a-table-column>
                  <a-table-column title="描述" :width="200">
                    <template #cell="{ record }">
                      {{ record.eventMsg }}
                    </template>
                  </a-table-column>
                </template>
              </a-table>
              <div class="pagination-footer" style="margin-top: 10px">
                <a-pagination size="mini" :page-size-options="[20, 50, 100, 200, 500]" show-total show-page-size :total="pageNation.total" :default-page-size="pageNation.pageSize" :current="pageNation.pageNum" style="float: right" @page-size-change="sizeChange" @change="changePage" />
              </div>
            </div>
          </a-tab-pane>
        </a-tabs>
      </div>

      <template #footer>
        <a-button size="medium" class="gray-outline" @click="handleCancel">取消</a-button>
        <a-button size="medium" type="primary" @click="handleOk('1')">保存</a-button>
        <a-button size="medium" type="primary" @click="handleOk('2')">保存并提交</a-button>
      </template>
    </a-modal>
  </div>
  <ProductList ref="prduct" @save="saveProduct" :ownerId="form.ownerId" :warehouseCode="form.outWarehouseCode" :shopId="shopInfo.sellerMarketId" />
</template>

<script lang="ts">
  import { defineComponent, ref, reactive, toRefs, computed, onMounted } from 'vue'
  import { updateLocationRemarkBatch } from '@/api/warehouse'
  import { Message } from '@arco-design/web-vue'
  import { getOrganizesUser } from '@/api/system'
  import { getTransOrderInfo, findWarehouseListByParam, findShopListByShare, commitTransOrder, findTransOrderLogPage, createTransOrder, updateTransOrder, upload } from '@/api/warehouse'
  import ProductList from './productList.vue'
  import _ from 'lodash-es'
  export default defineComponent({
    components: { ProductList },
    props: ['type', 'id', 'showModal'],
    // emits: ['save'],
    setup(props: any, { emit }) {
      let visible = ref(false)
      const formRef = ref()
      const prduct = ref()
      const data: any = reactive({
        visiable: props.show,
        form: {
          transType: 1,
        },
        fileList: [],
        rules: {
          transType: [{ required: true, message: '请选择调拨类型' }],
          outWarehouseCode: [{ required: true, message: '请选择调出仓' }],
          inWarehouseCode: [{ required: true, message: '请选择调入仓' }],
          shopId: [{ required: true, message: '请选择店铺' }],
          inShopId: [{ required: true, message: '请选择调入店铺' }],
          logisticType: [{ required: true, message: '请选择配送方式' }],
        },
        shopList: [],
        userList: [],
        houseList: [],
        inHouseList: [],
        outHouseList: [],
        tableList: [],
        logList: [],
        shopInfo: {},
        activePage: '1',
        pageNation: { total: 0, pageSize: 20, pageNum: 1 },
      })

      let title = computed(() => {
        let text = ''
        if (props.type == 'add') {
          text = '创建调拨单'
        } else {
          text = '编辑调拨单'
        }
        return text
      })

      const open = async () => {
        await getShopList()
        await getWarehouseList()
        await getUserList()
        await changeWarehouseType(data.form.transType != 1 ? data.form.transType : 1)
        if (props.type != 'add') {
          await getDetailInfo()
          await getLog()
        }
      }

      // 获取人员
      const getUserList = async () => {
        let params = {
          depart: false,
          needRole: false,
          pageNum: 1,
          pageSize: 1000,
        }
        const res = await getOrganizesUser(params)
        data.userList = res?.data?.records || []
      }

      const ownerChange = (val: string) => {
        data.tableList = []
        let obj: any = data.userList.find((e: any) => e.id == val)
        if (obj) {
          data.form.ownerName = obj.userName
        } else {
          data.form.ownerName = ''
        }
      }
      const inOwnerChange = (val: string) => {
        let obj: any = data.userList.find((e: any) => e.id == val)
        if (obj) {
          data.form.inOwnerName = obj.userName
        } else {
          data.form.inOwnerName = ''
        }
      }

      const handleOk = (type: number) => {
        formRef.value.validate(async (valid: any) => {
          if (!valid) {
            let params = {
              ...data.form,
              items: [],
            }

            if (data.fileList.length > 0) {
              params.attachment = data.fileList.map((e: any) => e.url)[0]
            } else {
              delete params.attachment
            }

            if (data.tableList.length == 0) {
              return Message.error('请选择商品数据')
            }
            console.log(data.tableList)

            for (let i = 0; i < data.tableList.length; i++) {
              const e = data.tableList[i]
              if (!e.amt) {
                return Message.error(`sku(${e.sku})的调拨数量不能为空`)
              }
            }

            data.tableList.forEach((e: any) => {
              let obj: any = {}
              obj.inventoryId = e.inventoryId ? e.inventoryId : e.id
              obj.amt = e.amt
              obj.price = e.avgPrice
              if (props.type == 'edit' && e.inventoryId) {
                obj.id = e.id
              }

              params.items.push(obj)
            })
            let res: any = {}

            if (type == 2) {
              params.status = '10'
            }

            if (props.type == 'add') {
              res = await createTransOrder(params)
            } else {
              res = await updateTransOrder(params)
            }

            if (res.code == 'SUCCESS') {
              // if (type == 2) {
              //   await submitAudit(data.form.id)
              // }
              data.form = {
                transType: 1,
              }
              data.fileList = []
              data.tableList = []
              props.type == 'add' ? Message.success('创建成功') : Message.success('编辑成功')
              emit('save')
            }
          }
        })
      }

      const submitAudit = async (id: string) => {
        await commitTransOrder({ ids: [id] })
      }

      const handleCancel = () => {
        emit('save', 'cancel')
      }

      // 获取店铺列表
      const getShopList = async () => {
        const res = await findShopListByShare()
        data.shopList = res?.data || []
        // let shareShop: any = data.shopList.find((e: any) => e.share)
        // data.form.shopId = shareShop.id
        // data.form.sellerId = shareShop.sellerId
        // data.form.sellerMarketId = shareShop.sellerMarketId
        // data.shopInfo = shareShop
      }
      // 获取仓库列表
      const getWarehouseList = async () => {
        const res = await findWarehouseListByParam()
        data.houseList = res?.data || []
      }

      const add = () => {
        formRef.value.validateField(['outWarehouseCode'], (valid: any) => {
          // formRef.value.validateField(['outWarehouseCode', 'shopId'], (valid: any) => {
          if (!valid) {
            prduct.value.visible = true
          }
        })
      }

      const saveProduct = (arr: any) => {
        if (data.tableList.length <= 0) {
          data.tableList = arr
        } else {
          arr.forEach((e: any) => {
            let index = data.tableList.findIndex((el: any) => el.sku == e.sku)
            if (index == -1) {
              data.tableList.push(e)
            }
          })
        }
      }

      const beforeUpload = async (file: any) => {
        const extension = file.name.substring(file.name.lastIndexOf('.') + 1)

        if (data.form.file) {
          Message.error('每次只能上传一个excel文件')
          return
        }

        if (!['xls', 'xlsx', 'zip', 'pdf', 'txt', 'png', 'jpg', 'jpeg', 'bmp', 'gif'].includes(extension)) {
          Message.error('当前文件格式不支持上传')
          return
        }

        let params = new FormData()
        params.append('file', file)
        const res: any = await upload(params)
        if (res.code == 'SUCCESS') {
          Message.success('附件上传成功')
          let urlArr = res?.data?.publicUrl.split('/')
          data.fileList.push({ url: res.data.publicUrl, name: urlArr[urlArr.length - 1], uid: '-1' })

          console.log(data.fileList)

          return true
        }
      }
      const beforeRemove = (file: any) => {
        data.fileList = []
      }

      const skuKind = computed(() => {
        let skuArr: any = []
        data.tableList.forEach((e: any) => {
          let index = skuArr.findIndex((el: any) => el == e.sku || e.msku)
          if (index == -1) {
            skuArr.push(e?.sku || e?.msku)
          }
        })
        return skuArr.length
      })
      const allPrice = computed(() => {
        let allPrice = 0
        data.tableList.forEach((e: any) => {
          allPrice += (e.amt || 0) * e.avgPrice
        })
        return allPrice
      })
      const provocateurNum = computed(() => {
        let num = 0
        data.tableList.forEach((e: any) => {
          num += e.amt
        })
        return num || 0
      })

      const getDetailInfo = async () => {
        const res = await getTransOrderInfo({ id: props.id })
        data.form = res?.data
        // delete data.form.attachment
        let arr = []
        if (res.data.items) {
          arr = res.data.items.map((e: any) => {
            e.avgPrice = e.price
            return e
          })
        }

        console.log(data.form, '222222222')

        data.tableList = arr || []
        let urlArr = res.data.attachment ? res.data.attachment.split('/') : []
        if (res.data.attachment) data.fileList.push({ url: res.data.attachment, name: urlArr[urlArr.length - 1] })
      }

      // 获取单据日志
      const getLog = async () => {
        let params = {
          transOrderId: props.id,
          pageNum: data.pageNation.pageNum,
          pageSize: data.pageNation.pageSize,
        }
        const res = await findTransOrderLogPage(params)
        data.pageNation.total = res.data.total
        data.logList = res?.data?.records || []
      }

      const changePage = (val: number) => {
        data.pageNation.pageNum = val
        getLog()
      }

      const sizeChange = (val: number) => {
        data.pageNation.pageNum = 1
        data.pageNation.pageSize = val
        getLog()
      }

      const filterEventType = (val: number) => {
        let text = ''
        switch (val) {
          case 1:
            text = '新建'
            break
          case 2:
            text = '更新'
            break
          case 3:
            text = '删除'
            break
          case 4:
            text = '作废'
            break
          case 5:
            text = '提交'
            break
          case 6:
            text = '审核'
            break
          case 7:
            text = '驳回'
            break
          case 8:
            text = '出库'
            break
          case 9:
            text = '入库'
            break
          default:
            text = '未知'
            break
        }
        return text
      }

      const selShop = (val: string) => {
        data.tableList = []
        data.shopInfo = data.shopList.find((e: any) => e.sellerMarketId == val)
        // let obj = data.shopList.find((e: any) => e.id == val)
        data.form.shopName = data.shopInfo.shopName
        data.form.sellerId = data.shopInfo.sellerId
        data.form.marketplaceId = data.shopInfo.marketplaceId
      }
      const selInShop = (val: string) => {
        let shopInfo = data.shopList.find((e: any) => e.sellerMarketId == val)
        // let obj = data.shopList.find((e: any) => e.id == val)
        data.form.inShopName = shopInfo.shopName
        data.form.inSellerId = shopInfo.sellerId
        data.form.inMarketplaceId = shopInfo.marketplaceId
      }

      const changeWarehouseType = (val: number) => {
        data.form.inWarehouseCode = ''
        data.form.outWarehouseCode = ''
        data.inHouseList = []
        data.outHouseList = []
        console.log(val)

        switch (val) {
          case 1:
            data.inHouseList = data.houseList.filter((e: any) => e.warehouseAttribute == 1)
            data.outHouseList = data.houseList.filter((e: any) => e.warehouseAttribute == 1)
            break
          case 2:
            data.inHouseList = data.houseList.filter((e: any) => e.warehouseAttribute == 2)
            data.outHouseList = data.houseList.filter((e: any) => e.warehouseAttribute == 1)
            break
          case 3:
            data.inHouseList = data.houseList.filter((e: any) => e.warehouseAttribute == 1)
            data.outHouseList = data.houseList.filter((e: any) => e.warehouseAttribute == 2)
            break
          case 4:
            data.inHouseList = data.houseList.filter((e: any) => e.warehouseAttribute == 2)
            data.outHouseList = data.houseList.filter((e: any) => e.warehouseAttribute == 2)
            break
        }
        console.log(data.inHouseList, data.outHouseList)
      }

      onMounted(() => {
        open()
      })

      return {
        ...(toRefs(data) as any),
        visible,
        formRef,
        prduct,
        open,
        handleOk,
        handleCancel,
        beforeUpload,
        beforeRemove,
        add,
        saveProduct,
        skuKind,
        allPrice,
        provocateurNum,
        title,
        changePage,
        sizeChange,
        filterEventType,
        selShop,
        changeWarehouseType,
        ownerChange,
        inOwnerChange,
        selInShop,
      }
    },
  })
</script>

<style lang="less" scoped>
  .table {
    margin-top: 10px;
  }

  .house-con {
    border: 1px solid #d7d7d7;
    border-radius: 5px;
    padding: 5px;
  }

  .tag {
    width: 50px;
    height: 20px;
    text-align: center;
    line-height: 20px;
    display: inline-block;
    // padding: 2px 10px;
    box-sizing: border-box;
    background-color: #165dff;
    color: white;
    font-size: 12px;
    border-radius: 20px;
  }

  :deep(.arco-upload-progress) {
    display: none;
  }

  :deep(.arco-upload-list-item-init) {
    display: none;
  }
</style>
